
@-webkit-keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform:translate3d(0, -100%, 0);
        transform:translate3d(0, -100%, 0)
    }
    to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@keyframes fadeInDown {
    from {
        opacity:0;
        -webkit-transform:translate3d(0, -100%, 0);
        transform:translate3d(0, -100%, 0)
    }
    to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@-webkit-keyframes fadeInUp {
    from {
        opacity:0;
        -webkit-transform:translate3d(0, 100%, 0);
        transform:translate3d(0, 100%, 0)
    }
    to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@keyframes fadeInUp {
    from {
        opacity:0;
        -webkit-transform:translate3d(0, 100%, 0);
        transform:translate3d(0, 100%, 0)
    }
    to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@-webkit-keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform:translate3d(-100%, 0, 0);
        transform:translate3d(-100%, 0, 0)
    }
    to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform:translate3d(-100%, 0, 0);
        transform:translate3d(-100%, 0, 0)
    }
    to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
}
@-webkit-keyframes fadeIn {
    from {
        opacity:0
    }
    to {
        opacity:1
    }
}
@keyframes fadeIn {
    from {
        opacity:0
    }
    to {
        opacity:1
    }
}
@-webkit-keyframes flash {
    from, 50%, to {
        opacity:1
    }
    25%, 75% {
        opacity:0
    }
}
@keyframes flash {
    from, 50%, to {
        opacity:1
    }
    25%, 75% {
        opacity:0
    }
}
@-webkit-keyframes floatDown {
    to, from {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    50% {
        opacity:.7;
        -webkit-transform:translate3d(0, -20px, 0);
        transform:translate3d(0, -20px, 0)
    }
}
@keyframes floatDown {
    to, from {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    50% {
        opacity:.7;
        -webkit-transform:translate3d(0, -20px, 0);
        transform:translate3d(0, -20px, 0)
    }
}
@-webkit-keyframes floatDown2 {
    50% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    to, from {
        opacity:.7;
        -webkit-transform:translate3d(0, -20px, 0);
        transform:translate3d(0, -20px, 0)
    }
}
@keyframes floatDown2 {
    50% {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    to, from {
        opacity:.7;
        -webkit-transform:translate3d(0, -20px, 0);
        transform:translate3d(0, -20px, 0)
    }
}
@-webkit-keyframes floatRight {
    from {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    to {
        opacity:1;
        -webkit-transform:translate3d(10px, 5px, 0);
        transform:translate3d(10px, 5px, 0)
    }
}
@keyframes floatRight {
    from {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    to {
        opacity:1;
        -webkit-transform:translate3d(10px, 5px, 0);
        transform:translate3d(10px, 5px, 0)
    }
}
@-webkit-keyframes floatLeft {
    from {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    to {
        opacity:1;
        -webkit-transform:translate3d(-20px, 14px, 0);
        transform:translate3d(-20px, 14px, 0)
    }
}
@keyframes floatLeft {
    from {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    to {
        opacity:1;
        -webkit-transform:translate3d(-20px, 14px, 0);
        transform:translate3d(-20px, 14px, 0)
    }
}
@-webkit-keyframes floatRight2 {
    from {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    to {
        opacity:1;
        -webkit-transform:translate3d(20px, 5px, 0);
        transform:translate3d(20px, 5px, 0)
    }
}
@keyframes floatRight2 {
    from {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    to {
        opacity:1;
        -webkit-transform:translate3d(20px, 5px, 0);
        transform:translate3d(20px, 5px, 0)
    }
}
.laboratory {
		width:686px;
		height:541px;
		display:inline-block;
		position:absolute;
		pointer-events:none;
		left: 50%;
		top: 50%;
		margin-left: -343px;
		margin-top:-220px;
}

.laboratory .component {
    position:absolute;
    opacity:0
}
.laboratory .grid {
    left:-279px;
    top:-54px;
    width:1111px;
    height:719px;
    opacity:1
}
.laboratory .machine {
    top:41px;
    left:202px;
    -webkit-animation:fadeInDown .6s .5s forwards linear;
    animation:fadeInDown .6s .5s forwards linear
}
.laboratory .machine img {
    width:182px;
    height:208px
}
.laboratory .machine .box_machine {
    top:97px;
    left:87px;
    -webkit-transform:skewY(-30deg);
    transform:skewY(-30deg);
    -webkit-animation:fadeIn 1s 3.1s forwards linear;
    animation:fadeIn 1s 3.1s forwards linear
}
@-webkit-keyframes floatMachineLayer {
    to, from {
        opacity:.1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:.5;
        -webkit-transform:translate3d(14px, 17px, 0);
        transform:translate3d(14px, 17px, 0)
    }
}
@keyframes floatMachineLayer {
    to, from {
        opacity:.1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:.5;
        -webkit-transform:translate3d(14px, 17px, 0);
        transform:translate3d(14px, 17px, 0)
    }
}
@-webkit-keyframes floatMachineLayer2 {
    to, from {
        opacity:.1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:.5;
        -webkit-transform:translate3d(26px, 30px, 0);
        transform:translate3d(26px, 30px, 0)
    }
}
@keyframes floatMachineLayer2 {
    to, from {
        opacity:.1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:.5;
        -webkit-transform:translate3d(26px, 30px, 0);
        transform:translate3d(26px, 30px, 0)
    }
}
.laboratory .machine .box_machine .layer {
    height:97px;
    width:85.5px;
    background:#81ffbc;
    display:inline-block
}
.laboratory .machine .box_machine .layer:nth-of-type(1) {
    -webkit-animation:floatMachineLayer 10s 3.1s infinite ease;
    animation:floatMachineLayer 10s 3.1s infinite ease
}
.laboratory .machine .box_machine .layer:nth-of-type(2) {
    -webkit-animation:floatMachineLayer2 10s 3.1s infinite ease;
    animation:floatMachineLayer2 10s 3.1s infinite ease
}
.laboratory .machine .chart_machine {
    -webkit-animation:fadeIn 1s 1.1s forwards linear;
    animation:fadeIn 1s 1.1s forwards linear;
    height:31px;
    width:46.5px;
    background:#00B27A;
    display:inline-block;
    position:absolute;
    -webkit-transform:skewY(30deg);
    transform:skewY(30deg);
    top:83px;
    left:17px
}
.laboratory .machine .chart_machine .lines {
    -webkit-animation:fadeIn 1s 2.1s forwards linear;
    animation:fadeIn 1s 2.1s forwards linear;
    overflow:hidden;
    left:0;
    bottom:5px;
    width:50px;
    height:24px;
    display:inline-block
}
.laboratory .machine .chart_machine .lines .line {
    background:#02E882;
    display:inline-block;
    position:absolute;
    bottom:0;
    width:3px;
    left:40px;
    -webkit-animation:floatMachineLine80 7s 2.1s infinite ease;
    animation:floatMachineLine80 7s 2.1s infinite ease
}
@-webkit-keyframes floatMachineLine80 {
    from, to {
        opacity:1;
        -webkit-transform:translate3d(0, 80%, 0);
        transform:translate3d(0, 80%, 0)
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(0, 5%, 0);
        transform:translate3d(0, 5%, 0)
    }
}
@keyframes floatMachineLine80 {
    from, to {
        opacity:1;
        -webkit-transform:translate3d(0, 80%, 0);
        transform:translate3d(0, 80%, 0)
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(0, 5%, 0);
        transform:translate3d(0, 5%, 0)
    }
}
.laboratory .machine .chart_machine .lines .line:nth-child(1) {
    left:2.5px;
    height:30%
}
.laboratory .machine .chart_machine .lines .line:nth-child(2) {
    left:8px;
    height:50%
}
.laboratory .machine .chart_machine .lines .line:nth-child(3) {
    left:13.5px;
    height:35%
}
.laboratory .machine .chart_machine .lines .line:nth-child(4) {
    left:19px;
    height:80%
}
.laboratory .machine .chart_machine .lines .line:nth-child(5) {
    left:24.5px;
    height:45%
}
.laboratory .machine .chart_machine .lines .line:nth-child(6) {
    left:30px;
    height:85%
}
.laboratory .machine .chart_machine .lines .line:nth-child(7) {
    left:35.5px;
    height:60%
}
.laboratory .machine .chart_machine .lines .line:nth-child(8) {
    left:41px;
    height:65%
}
.laboratory .machine_light1 {
    left:255px;
    top:51px;
    -webkit-animation:fadeInUp .5s 1.3s forwards linear;
    animation:fadeInUp .5s 1.3s forwards linear
}
.laboratory .machine_light2 {
    left:255px;
    top:34px;
    -webkit-animation:fadeIn .5s 2.1s forwards linear;
    animation:fadeIn .5s 2.1s forwards linear
}
.laboratory .machine_light {
    left:255px;
    top:8px;
    -webkit-animation:flash 5s 2.1s forwards linear infinite;
    animation:flash 5s 2.1s forwards linear infinite
}
.laboratory .laptop {
    top:89px;
    left:-8px;
    -webkit-animation:fadeInDown 1s 1.3s forwards linear;
    animation:fadeInDown 1s 1.3s forwards linear
}
.laboratory .laptop img {
    width:291px;
    height:308px
}
.laboratory .laptop .box_laptop {
    top:0;
    left:0;
    -webkit-animation:floatRight2 1.7s 3.3s forwards linear;
    animation:floatRight2 1.7s 3.3s forwards linear
}
.laboratory .laptop .box_laptop .layer {
    height:116px;
    width:153px;
    background-image:linear-gradient(125deg, #fff, rgba(255, 255, 255, .73));
    display:inline-block;
    -webkit-transform:skewY(-29.5deg);
    transform:skewY(-29.5deg);
    top:57px;
    left:13px;
    opacity:1
}
.laboratory .laptop .box_laptop .layer .page {
    opacity:1
}
.laboratory .laptop .box_laptop .layer .page .picture {
    left:9px;
    top:11px;
    opacity:1
}
.laboratory .laptop .box_laptop .layer .page .text {
    display:inline-block;
    background:#D7D8D8;
    opacity:.3
}
.laboratory .laptop .box_laptop .layer .page .text:nth-of-type(1) {
    width:27px;
    height:20px;
    left:47px;
    top:12px
}
.laboratory .laptop .box_laptop .layer .page .text:nth-of-type(2) {
    width:17px;
    height:3px;
    left:47px;
    top:35px
}
.laboratory .laptop .box_laptop .layer .page .text:nth-of-type(3) {
    width:27px;
    height:3px;
    left:47px;
    top:42px
}
.laboratory .laptop .box_laptop .layer .page .text:nth-of-type(4) {
    width:20px;
    height:3px;
    left:47px;
    top:49px
}
.laboratory .laptop .box_laptop .layer .page .text:nth-of-type(5) {
    left:9px;
    top:62px;
    height:27px;
    width:66px
}
.laboratory .laptop .box_laptop .layer .chart-bar {
    width:65px;
    height:39px;
    bottom:12px;
    left:20px;
    overflow:hidden;
    opacity:1
}
.laboratory .laptop .box_laptop .layer .chart-bar .bar {
    background:#02f0f2;
    height:4px;
    -webkit-animation:fadeInLeft 1.5s 5s forwards linear;
    animation:fadeInLeft 1.5s 5s forwards linear
}
.laboratory .laptop .box_laptop .layer .chart-bar .bar:nth-of-type(1) {
    width:30%;
    top:0
}
.laboratory .laptop .box_laptop .layer .chart-bar .bar:nth-of-type(2) {
    width:80%;
    top:8px
}
.laboratory .laptop .box_laptop .layer .chart-bar .bar:nth-of-type(3) {
    width:40%;
    top:16px
}
.laboratory .laptop .box_laptop .layer .chart-bar .bar:nth-of-type(4) {
    width:90%;
    top:24px
}
.laboratory .laptop .box_laptop .layer .user-box {
    right:27px;
    width:37px;
    height:74px;
    top:15px;
    -webkit-animation:fadeIn 1s 5s forwards linear;
    animation:fadeIn 1s 5s forwards linear
}
.laboratory .laptop .box_laptop .layer .user-box .user {
    width:37px;
    height:74px
}
.laboratory .laptop .box_laptop .layer .user-box .user:nth-of-type(1) {
    background-image:linear-gradient(to bottom, #01f77a, rgba(1, 247, 122, 0));
    opacity:.3
}
@-webkit-keyframes floatUser2 {
    from, to {
        opacity:.5;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:.5;
        -webkit-transform:translate3d(10px, 10px, 0);
        transform:translate3d(10px, 10px, 0)
    }
}
@keyframes floatUser2 {
    from, to {
        opacity:.5;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:.5;
        -webkit-transform:translate3d(10px, 10px, 0);
        transform:translate3d(10px, 10px, 0)
    }
}
.laboratory .laptop .box_laptop .layer .user-box .user:nth-of-type(2) {
    background-image:linear-gradient(to bottom, #01f77a, rgba(1, 247, 122, .2));
    -webkit-animation:floatUser2 10s 5s infinite ease;
    animation:floatUser2 10s 5s infinite ease
}
@-webkit-keyframes floatUser3 {
    from, to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(20px, 20px, 0);
        transform:translate3d(20px, 20px, 0)
    }
}
@keyframes floatUser3 {
    from, to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(20px, 20px, 0);
        transform:translate3d(20px, 20px, 0)
    }
}
.laboratory .laptop .box_laptop .layer .user-box .user:nth-child(3) {
    background-image:linear-gradient(to bottom, #01f77a, rgba(1, 247, 122, .45));
    -webkit-animation:floatUser3 10s 5s infinite ease;
    animation:floatUser3 10s 5s infinite ease
}
.laboratory .phone {
    top:350px;
    left:209px;
    -webkit-animation:fadeInDown 1s 2.3s forwards linear;
    animation:fadeInDown 1s 2.3s forwards linear
}
.laboratory .phone img {
    width:177px;
    height:110px
}
@-webkit-keyframes floatUp20 {
    from, to {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(0, -20px, 0);
        transform:translate3d(0, -20px, 0)
    }
}
@keyframes floatUp20 {
    from, to {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(0, -20px, 0);
        transform:translate3d(0, -20px, 0)
    }
}
@-webkit-keyframes floatUp40 {
    from, to {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(0, -40px, 0);
        transform:translate3d(0, -40px, 0)
    }
}
@keyframes floatUp40 {
    from, to {
        opacity:0;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(0, -40px, 0);
        transform:translate3d(0, -40px, 0)
    }
}
.laboratory .phone .box_phone:nth-of-type(1) {
    -webkit-animation:floatUp20 10s 4.8s infinite ease;
    animation:floatUp20 10s 4.8s infinite ease
}
.laboratory .phone .box_phone:nth-of-type(2) {
    -webkit-animation:floatUp40 10s 4.8s infinite ease;
    animation:floatUp40 10s 4.8s infinite ease
}
.laboratory .phone .box_phone .layer {
    -webkit-animation:fadeIn 2s 4.8s forwards linear;
    animation:fadeIn 2s 4.8s forwards linear;
    display:inline-block;
    -webkit-transform:skewX(-60deg) skewY(16deg);
    transform:skewX(-60deg) skewY(16deg);
    top:-88px;
    left:32px;
    height:51px;
    width:118px;
    background-color:rgba(255, 255, 255, .5)
}
.laboratory .mac {
    top:-6px;
    left:441px;
    -webkit-animation:fadeInDown .5s 3.3s forwards linear;
    animation:fadeInDown .5s 3.3s forwards linear
}
.laboratory .mac img {
    width:237px;
    height:379px
}
.laboratory .mac .box_mac {
    top:0;
    -webkit-animation:floatLeft 1s 6.6s forwards linear;
    animation:floatLeft 1s 6.6s forwards linear
}
.laboratory .mac .box_mac .layer {
    height:174px;
    width:217px;
    background-image:linear-gradient(151deg, #fff, rgba(255, 255, 255, .54));
    display:inline-block;
    -webkit-transform:skewY(30deg);
    transform:skewY(30deg);
    top:76px;
    left:7px;
    opacity:.9
}
.laboratory .mac .box_mac .layer .folder {
    left:8px;
    top:10px
}
@-webkit-keyframes floatFolder1 {
    from, to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(-30px, 35px, 0);
        transform:translate3d(-30px, 35px, 0)
    }
}
@keyframes floatFolder1 {
    from, to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(-30px, 35px, 0);
        transform:translate3d(-30px, 35px, 0)
    }
}
@-webkit-keyframes floatFolder2 {
    from, to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(-15px, 17.5px, 0);
        transform:translate3d(-15px, 17.5px, 0)
    }
}
@keyframes floatFolder2 {
    from, to {
        opacity:1;
        -webkit-transform:none;
        transform:none
    }
    75% {
        opacity:1;
        -webkit-transform:translate3d(-15px, 17.5px, 0);
        transform:translate3d(-15px, 17.5px, 0)
    }
}
.laboratory .mac .box_mac .layer .folder:nth-of-type(1) {
    opacity:1
}
.laboratory .mac .box_mac .layer .folder:nth-of-type(3) {
    -webkit-animation:floatFolder1 10s 7.6s infinite ease;
    animation:floatFolder1 10s 7.6s infinite ease
}
.laboratory .mac .box_mac .layer .folder:nth-of-type(2) {
    -webkit-animation:floatFolder2 10s 7.6s infinite ease;
    animation:floatFolder2 10s 7.6s infinite ease
}
.laboratory .mac .box_mac .layer .chart-pie {
    -webkit-animation:pieRotateIn 1.5s 8.6s forwards linear;
    animation:pieRotateIn 1.5s 8.6s forwards linear;
    left:14px;
    bottom:15px
}
@-webkit-keyframes pieRotateIn {
    from {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:rotate(720deg) scale3d(0.1, .1, 1);
        transform:rotate(720deg) scale3d(0.1, .1, 1);
        opacity:0
    }
    to {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:none;
        transform:none;
        opacity:1
    }
}
@keyframes pieRotateIn {
    from {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:rotate(720deg) scale3d(0.1, .1, 1);
        transform:rotate(720deg) scale3d(0.1, .1, 1);
        opacity:0
    }
    to {
        -webkit-transform-origin:center;
        transform-origin:center;
        -webkit-transform:none;
        transform:none;
        opacity:1
    }
}
.laboratory .mac .box_mac .layer .chart-progress {
    top:30px;
    right:100px;
    -webkit-animation:fadeIn 1s 7.6s forwards linear;
    animation:fadeIn 1s 7.6s forwards linear
}
.laboratory .mac .box_mac .layer .chart-progress .progress-circle {
    display:inline-block;
    width:10px;
    height:10px;
    border-radius:100%;
    opacity:1
}
.laboratory .mac .box_mac .layer .chart-progress .progress-circle:nth-of-type(1) {
    top:0;
    background:#01f77a
}
.laboratory .mac .box_mac .layer .chart-progress .progress-circle:nth-of-type(2) {
    top:20px;
    background:#00c084
}
.laboratory .mac .box_mac .layer .chart-progress .progress-circle:nth-of-type(3) {
    top:40px;
    background:#00b27a
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box {
    left:17px;
    width:70px;
    overflow:hidden;
    height:50px;
    opacity:1
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box .progress-bar {
    display:inline-block;
    height:2px;
    left:5px;
    background:#D9D9D9;
    -webkit-animation:fadeInLeft 1s 8.6s forwards linear;
    animation:fadeInLeft 1s 8.6s forwards linear
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box .progress-bar:nth-of-type(1) {
    width:70%;
    top:0
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box .progress-bar:nth-of-type(2) {
    width:60%;
    top:4px
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box .progress-bar:nth-of-type(3) {
    width:75%;
    top:20px
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box .progress-bar:nth-of-type(4) {
    width:70%;
    top:24px
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box .progress-bar:nth-of-type(5) {
    width:50%;
    top:40px
}
.laboratory .mac .box_mac .layer .chart-progress .progress-bar-box .progress-bar:nth-of-type(6) {
    width:80%;
    top:44px
}
.laboratory .mac .box_mac .layer .chart-bar {
    bottom:18px;
    right:26px;
    width:105px;
    height:65px;
    overflow:hidden;
    -webkit-animation:fadeIn 2s 7.6s forwards linear;
    animation:fadeIn 2s 7.6s forwards linear
}
@-webkit-keyframes floatBar80 {
    from, to {
        -webkit-transform:translate3d(0, 20%, 0);
        transform:translate3d(0, 20%, 0);
        opacity:1
    }
    50% {
        -webkit-transform:translate3d(0, 80%, 0);
        transform:translate3d(0, 80%, 0);
        opacity:1
    }
}
@keyframes floatBar80 {
    from, to {
        -webkit-transform:translate3d(0, 20%, 0);
        transform:translate3d(0, 20%, 0);
        opacity:1
    }
    50% {
        -webkit-transform:translate3d(0, 80%, 0);
        transform:translate3d(0, 80%, 0);
        opacity:1
    }
}
@-webkit-keyframes floatBar90 {
    from, to {
        -webkit-transform:translate3d(0, 90%, 0);
        transform:translate3d(0, 90%, 0);
        opacity:1
    }
    25%, 75% {
        -webkit-transform:translate3d(0, 50%, 0);
        transform:translate3d(0, 50%, 0);
        opacity:1
    }
    50% {
        -webkit-transform:translate3d(0, 10%, 0);
        transform:translate3d(0, 10%, 0);
        opacity:1
    }
}
@keyframes floatBar90 {
    from, to {
        -webkit-transform:translate3d(0, 90%, 0);
        transform:translate3d(0, 90%, 0);
        opacity:1
    }
    25%, 75% {
        -webkit-transform:translate3d(0, 50%, 0);
        transform:translate3d(0, 50%, 0);
        opacity:1
    }
    50% {
        -webkit-transform:translate3d(0, 10%, 0);
        transform:translate3d(0, 10%, 0);
        opacity:1
    }
}
.laboratory .mac .box_mac .layer .chart-bar .bar {
    display:inline-block;
    width:5px;
    bottom:0;
    height:100%;
    background:#02F0F2
}
.laboratory .mac .box_mac .layer .chart-bar .bar::after {
    display:inline-block;
    background:#D7D8D8;
    width:100%;
    height:100%;
    content:'';
    opacity:.3;
    margin-left:7px;
    margin-top:-10px
}
.laboratory .mac .box_mac .layer .chart-bar .bar:nth-child(1) {
    left:15px;
    -webkit-animation:floatBar80 15s 7.6s ease infinite;
    animation:floatBar80 15s 7.6s ease infinite
}
.laboratory .mac .box_mac .layer .chart-bar .bar:nth-child(2) {
    left:30px;
    -webkit-animation:floatBar90 9.2s 7.6s ease infinite;
    animation:floatBar90 9.2s 7.6s ease infinite
}
.laboratory .mac .box_mac .layer .chart-bar .bar:nth-child(3) {
    left:45px;
    -webkit-animation:floatBar80 14s 7.6s ease infinite;
    animation:floatBar80 14s 7.6s ease infinite
}
.laboratory .mac .box_mac .layer .chart-bar .bar:nth-child(4) {
    left:60px;
    -webkit-animation:floatBar90 11s 7.6s ease infinite;
    animation:floatBar90 11s 7.6s ease infinite
}
.laboratory .mac .box_mac .layer .chart-bar .bar:nth-child(5) {
    left:75px;
    -webkit-animation:floatBar80 10.3s 7.6s ease infinite;
    animation:floatBar80 10.3s 7.6s ease infinite
}
.laboratory .mac .box_mac .layer .chart-bar .bar:nth-child(6) {
    left:90px;
    -webkit-animation:floatBar90 16s 7.6s ease infinite;
    animation:floatBar90 16s 7.6s ease infinite
}
.laboratory .cord {
    left:147px;
    top:214px;
    opacity:1
}
@-webkit-keyframes dash {
    to {
        stroke-dashoffset:0
    }
}
@keyframes dash {
    to {
        stroke-dashoffset:0
    }
}
.laboratory .cord .line_laptop {
    stroke-dasharray:100;
    stroke-dashoffset:100;
    -webkit-animation:dash 1s 2.3s forwards linear;
    animation:dash 1s 2.3s forwards linear
}
.laboratory .cord .line_phone {
    stroke-dasharray:465;
    stroke-dashoffset:465;
    -webkit-animation:dash 1.5s 3.3s forwards linear;
    animation:dash 1.5s 3.3s forwards linear
}
.laboratory .cord .line_mac1 {
    stroke-dasharray:140;
    stroke-dashoffset:140;
    -webkit-animation:dash .9s 4.8s forwards linear;
    animation:dash .9s 4.8s forwards linear
}
.laboratory .cord .line_mac2 {
    stroke-dasharray:345;
    stroke-dashoffset:345;
    -webkit-animation:dash .9s 5.7s forwards linear;
    animation:dash .9s 5.7s forwards linear
}
.laboratory .stars {
    left:278px;
    top:51px;
    -webkit-animation:fadeIn 1.5s 2.1s forwards linear;
    animation:fadeIn 1.5s 2.1s forwards linear
}
.laboratory .stars .star {
    position:absolute
}
.laboratory .stars .star::before, .laboratory .stars .star::after {
    content:'';
    background:#fff;
    display:inline-block;
    position:absolute
}
.laboratory .stars .star::after {
    width:2px;
    height:7.5px;
    top:-2.75px
}
.laboratory .stars .star::before {
    width:7.5px;
    height:2px;
    left:-2.75px
}
.laboratory .stars .star:nth-child(1), .laboratory .stars .star:nth-child(2), .laboratory .stars .star:nth-child(3) {
    -webkit-animation:floatDown 5s 0s forwards ease-in-out infinite;
    animation:floatDown 5s 0s forwards ease-in-out infinite;
    left:30px
}
.laboratory .stars .star:nth-child(4), .laboratory .stars .star:nth-child(5), .laboratory .stars .star:nth-child(6) {
    -webkit-animation:floatDown2 5s 0s forwards ease-in-out infinite;
    animation:floatDown2 5s 0s forwards ease-in-out infinite
}
.laboratory .stars .star:nth-child(1) {
    top:-20px
}
.laboratory .stars .star:nth-child(2) {
    top:-35px
}
.laboratory .stars .star:nth-child(3) {
    top:-50px
}
.laboratory .stars .star:nth-child(4) {
    top:-25px
}
.laboratory .stars .star:nth-child(5) {
    top:-40px
}
.laboratory .stars .star:nth-child(6) {
    top:-55px
}
/* .pa {
    position: relative;
}
.lay {
    position: absolute;

} */
/* .bule11 {
    background-color: linear-gradient(rgb(20, 193, 155), rgb(9, 222, 155));
} */
